﻿<%@ Page Title="" Language="C#" MasterPageFile="~/admin/admin.master" AutoEventWireup="true" CodeFile="Add_EditPicture.aspx.cs" Inherits="admin_Product_Add_EditPicture" %>



<%@ Register Src="Menu.ascx" TagName="TabMenu" TagPrefix="menu" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
 <script type="text/javascript">
     $(document).ready(function () {
         $(".url").colorbox({ width: "650px", height: "600px", inline: true, href: "#servicedialog" });
         $('#tabs').tabs();

     });
     function insertUrl(url) {
         $("[id$='txtServiceName']").val(url);
         closeOverlay();
     } function insertID(url) {
         $("[id$='txtServiceID']").val(url);
         closeOverlay();
     }
    </script>
    <div class="content-box-outer">
       <div class="content-box-right">
            <menu:TabMenu ID="TabMenu" runat="server" />
        </div>
        <div class="content-box-left">
        
            <h1>
                Thêm / Cập nhật Hình ảnh
            </h1>
           
            <table class="tblForm largeForm" style="width: 100%; margin: 0;">
                <tr>
                    <td style="vertical-align: top; padding: 0 40px 0 0;">
                        <ul class="fl">
                            <li>
                                <label class="lbl">
                                    Khóa học</label>
                                <asp:TextBox runat="server" ID="txtServiceName" Width="600px" />
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtServiceName"
                                    ErrorMessage="*" Display="Dynamic" ValidationGroup="add" /> <a href="#" class="url">Url</a>
                            </li>
                            <li>
                                <label class="lbl">
                                    Alt</label>
                                    <div style="display:none">
                                    <asp:TextBox ID="txtImageID" runat="server" ></asp:TextBox>
                                    </div>
                                <asp:TextBox runat="server" ID="txtAlt" Width="600px" />
                                <div style="display:none">
                                <asp:TextBox ID="txtServiceID" runat="server"></asp:TextBox>
                                </div>
                            </li>
                            <li>
                                <label class="lbl">
                                    Title</label>
                                <asp:TextBox runat="server" ID="txtTitle" Width="600px" />
                            </li>
                             <li>
                                <label class="lbl">
                                    Tùy chọn</label>
                               
                            </li>
                            <li>
                                <asp:CheckBox runat="server" ID="cbPublish" Text="Được hiển thị" Checked="true" />
                            </li>
                           
                        </ul>
                        <div class="action_buttons">
                            <asp:Button ID="btnSave" runat="server" Text="Lưu" ValidationGroup="add"
                                CssClass="btn primary rounded" OnClick="btnSave_Click" />
                            hoặc &nbsp; <a href="Picture.aspx" title="Hủy">
                                Hủy</a> <span id="autoSaveLabel" style="display: none;">
                            </span>
                        </div>
                    </td>
                    <td class="secondaryForm" style="padding: 0; vertical-align: top;">
                        <ul class="fl">
                           
                            <li>
                                <label class="lbl">
                                    Hình ảnh</label>
                                <div class="rounded" style="overflow-y: auto; height: 160px; max-height: 160px; border: solid 1px #dcdcdc;
                                    padding: 5px; margin: 0 0 5px; text-align: center">
                                    <img src="/uploads/images/noimage.png" width="160" height="160" runat="server" id="imgthumb"
                                        clientid="Static" alt="" />
                                </div>
                                <div>
                                    <asp:TextBox ID="txtPicture" runat="server" CssClass="txt200" Text="/uploads/images/noimage.png"></asp:TextBox>
                                    <span class="belowHelp">
                                        Ảnh đại diện</span>
                                </div>
                            </li>                          
                        </ul>
                    </td>
                </tr>
            </table>
        </div>
    </div>
     <div style="display: none">
        
    </div>
    <script type="text/javascript">
        jQuery(document).ready(function () {

            var thumb = jQuery("img#<%=imgthumb.ClientID %>");
            var txtPicture = jQuery("#<%=txtPicture.ClientID %>");

            new AjaxUpload(thumb, {

                action: '/ImageUpload.axd',
                name: 'myFile',
                onSubmit: function (file, extension) {
                    if (!(extension && /^(jpg|png|jpeg|gif|bmp|JPG|PNG|JPEG|BMP|GIF)$/.test(extension))) {

                        alert('Only JPG, PNG or GIF files are allowed');
                        return false;
                    }

                    thumb.attr('src', '/uploads/images/1.gif');

                    txtPicture.val('Loading...');
                    txtPicture.attr('disabled', true);
                    this.disable();

                },
                onComplete: function (file, response) {
                    thumb.load(function () {

                        thumb.unbind();

                    });
                    txtPicture.attr('disabled', false);
                    var resp = response;
                    resp = $(resp).html();
                    thumb.attr('src', resp);
                    this.enable();

                    txtPicture.val(resp);

                }
            });


        });
    </script>
    <script type="text/javascript">
        $(document).ready(function () {
            var thumb = jQuery("img#<%=imgthumb.ClientID %>");
            var txtPicture = jQuery("#<%=txtPicture.ClientID %>");
            txtPicture.blur(function () {
                thumb.attr('src', txtPicture.val());
            });
        });
    </script>
</asp:Content>



